import * as Blockly from 'blockly/core';
import * as XScrollbar from 'xscrollbar';
import * as Mixly from 'mixly';
import * as $ from 'jquery';
import * as layui from 'layui';
import BlockTool from "./blockTool";
import colorBlocks from './block/color';
import inputBlocks from './block/input';
import mainBlocks from './block/main';
import typeBlocks from './block/type';
import viewBlocks from './block/view';
import xmlBlocks from './block/xml';

import colorGenerator from './generator/color';
import inputGenerator from './generator/input';
import mainGenerator from './generator/main';
import typeGenerator from './generator/type';
import viewGenerator from './generator/view';
import xmlGenerator from './generator/xml';

import './css/blockTool.css';

const { element } = layui;
const { Config, Editor } = Mixly;
const { USER } = Config;
const Generator = Blockly.Arduino ?? Blockly.Python;

Object.assign(
    Blockly.Blocks,
    colorBlocks,
    inputBlocks,
    mainBlocks,
    typeBlocks,
    viewBlocks,
    xmlBlocks
);

Object.assign(
    Generator.forBlock,
    colorGenerator,
    inputGenerator,
    mainGenerator,
    typeGenerator,
    viewGenerator,
    xmlGenerator
);

const block_tool_view_register = function () {
    let xmlList = [];
    xmlList.push($('<button text="打开图形块预览框" callbackKey="BlockToolViewButtonPressed"></button>')[0]);
    xmlList.push($(BlockTool.BLOCK_TOOL_VIEW_XML)[0]);
    return xmlList;
}

const variableRegister = setInterval(function () {
    if (!Editor.blockEditor) {
        return;
    }
    clearInterval(variableRegister);
    if (BlockTool.workspace) {
        return;
    }
    $('body').append(BlockTool.$content);
    let trackBackground, thumbBackground;
    if (USER.theme === 'dark') {
        trackBackground = '#222';
        thumbBackground = '#b0b0b0';
    } else {
        trackBackground = '#ddd';
        thumbBackground = '#5f5f5f';
    }
    BlockTool.viewerScrollbar = new XScrollbar($('div[lay-filter="block-tool-viewer-filter"] .layui-tab-title')[0], {
        onlyHorizontal: true,
        thumbSize: 2,
        thumbRadius: 2,
        trackBackground,
        thumbBackground
    });
    element.on('tab(block-tool-viewer-filter)', function () {
        switch ($(this).attr('lay-id')) {
        case 'blockViewer':
            $(BlockTool.workspace.getParentSvg()).attr({
                width: BlockTool.$workspaceContainer.width(),
                height: BlockTool.$workspaceContainer.height()
            });
            Blockly.svgResize(BlockTool.workspace);
            BlockTool.viewerTabIndex = 'blockViewer';
            break;
        case 'blockEditor':
            BlockTool.ace.block.resize();
            BlockTool.viewerTabIndex = 'blockEditor';
            break;
        case 'generatorEditor':
            BlockTool.ace.generator.resize();
            BlockTool.viewerTabIndex = 'generatorEditor';
            break;
        case 'xmlEditor':
            BlockTool.ace.xml.resize();
            BlockTool.viewerTabIndex = 'xmlEditor';
            break;
        case 'blocksXmlEditor':
            BlockTool.ace.blocksXml.resize();
            BlockTool.viewerTabIndex = 'blocksXmlEditor';
            break;
        }
    });
    BlockTool.workspace = BlockTool.createBlockToolWorkspace();
    BlockTool.ace.block = BlockTool.createBlockToolCodeEditor(BlockTool.$blockContainer[0], 'javascript', 4);
    BlockTool.ace.generator = BlockTool.createBlockToolCodeEditor(BlockTool.$generatorContainer[0], 'javascript', 4);
    BlockTool.ace.xml = BlockTool.createBlockToolCodeEditor(BlockTool.$xmlContainer[0], 'xml', Generator.INDENT.length);
    BlockTool.ace.blocksXml = BlockTool.createBlockToolCodeEditor(BlockTool.$blocksXmlContainer[0], 'xml', Generator.INDENT.length);
    Editor.blockEditor.registerToolboxCategoryCallback('BLOCK_TOOL_VIEW', block_tool_view_register);
    Editor.blockEditor.registerButtonCallback('BlockToolViewButtonPressed', BlockTool.blockToolViewClickFunc);
}, 1000);